<!DOCTYPE html>
<html class="no-js" lang="pt" xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
	<title>#{pageTitle}</title>

	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width" />
	<meta name="description" content="#{pageDescription}" />
	<meta name="keywords" content="#{pageKeywords}" />
	<meta name="author" content="#{pageAuthor}" />
	
	<link rel="icon" type="image/x-icon" href="favicon.ico"/>
	<link rel="stylesheet" type='text/css' href="http://fonts.googleapis.com/css?family=Ubuntu:400,500,700,400italic,500italic,700italic" />
	<link rel="stylesheet" type='text/css' href="css/normalize.css" />
	<link rel="stylesheet" type='text/css' href="css/foundation.css" />
	<link rel="stylesheet" type='text/css' href="css/jquery-ui.css" />
	<link rel="stylesheet" type='text/css' href="css/font-awesome.css" />
	<link rel="stylesheet" type='text/css' href="css/app.css" />
	<ui:insert name="css"></ui:insert>

	<script src="js/modernizr.js"></script>
	<ui:insert name="js_head"></ui:insert>
</h:head>
<h:body id="#{pageName}">
	<!-- Loads the user profile -->
	<h:outputText rendered="#{not empty userSessionBean.authManager}"
		value="#{userSessionBean.getUserProfile()}" />

	<header id="header" class="row">
		<div class="large-12 columns" style="padding: 0 !important;">
			<ui:insert name="header"></ui:insert>
		</div>
	</header>

	<ui:insert name="feature"></ui:insert>

	<div id="content" class="row">
		<p:growl id="global-growl" sticky="true" />
		<div class="large-9 columns">
			<ui:insert name="bannerContentTop"></ui:insert>
			<ui:insert name="content"></ui:insert>
		</div>
		<aside class="large-3 columns">
			<ui:insert name="sidebar">
				<div id="sidebar-tags" class="panel">
					<span class="icon-tag"></span> <strong>Top Tags</strong>
					<hr />
					<ui:repeat var="tag" value="#{tagBean.topTags}">
						<a href="documents.xhtml?tag=#{tag}" class="tiny button">#{tag}</a>
					</ui:repeat>
				</div>
				<div id="sidebar-tags" class="panel">
					<span class="icon-tag"></span> <strong>Tags Novas</strong>
					<hr />
					<ui:repeat var="tag" value="#{tagBean.newTags}">
						<a href="documents.xhtml?tag=#{tag}" class="tiny button">#{tag}</a>
					</ui:repeat>
				</div>
			</ui:insert>
			<ui:insert name="bannerSidebarBottom"></ui:insert>
		</aside>
	</div>

	<footer id="footer" class="row">
		<div class="large-10 large-centered columns">
			<ui:insert name="footer"></ui:insert>
		</div>
	</footer>

	<!-- Dialogs -->
	<ui:insert name="dialogs"></ui:insert>
	<div id="dlg-logout" class="reveal-modal small">
		<h3>Deseja sair do ReviewIt?</h3>
		<h:form id="form-logout">
			<p:commandButton action="#{userSessionBean.logout()}" value="Sim"
				update="form-logout" process="form-logout" />
			<p:commandButton value="Não"
				onclick="$('#dlg-logout').foundation('reveal', 'close');" />
		</h:form>
	</div>
	<div id="dlg-login" class="reveal-modal small">
		<a class="close-reveal-modal">&#215;</a>
		<h3>
			<span class="icon-lock"></span>Login
		</h3>
		<div>Entrar com</div>
		<div class="login-with text-center">
			<h:form id="form-social" rendered="#{empty userSessionBean.profile}">
				<h:commandLink class="logo-facebook"
					action="#{userSessionBean.login()}">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="facebook" />
					<img src="images/facebook.png" />
				</h:commandLink>
				<h:commandLink class="logo-twitter"
					action="#{userSessionBean.login()}">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="twitter" />
					<img src="images/twitter.png" />
				</h:commandLink>
				<h:commandLink class="logo-google"
					action="#{userSessionBean.login()}" rendered="false">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="google" />
					<img src="images/google.png" />
				</h:commandLink>
			</h:form>
		</div>
		<hr />
		<h:form id="form-login">
			<p:messages id="msg-login" autoUpdate="true" closable="true"
				showDetail="false" />

			<h:outputText for="login-email" value="Email" />
			<p:inputText id="login-email" value="#{userSessionBean.user.email}"
				required="true" validator="validaEmail"
				requiredMessage="Favor informar o email" />

			<h:outputText for="login-password" value="Senha" required="true"
				requiredMessage="Favor informar a senha" />
			<p:password id="login-password"
				value="#{userSessionBean.user.password}" />

			<p:commandButton action="#{userSessionBean.login()}" value="Entrar"
				update="form-login" process="form-login">
				<f:setPropertyActionListener target="#{userSessionBean.provider}"
					value="reviewit" />
			</p:commandButton>
			<p:commandButton action="#{userSessionBean.esqueceuSenha()}"
				value="Esqueci a Senha" update="form-login" process="form-login">
				<f:setPropertyActionListener target="#{userSessionBean.provider}"
					value="reviewit" />
			</p:commandButton>
		</h:form>
	</div>
	<div id="dlg-register" class="reveal-modal small">
		<a class="close-reveal-modal">&#215;</a>
		<h3>
			<span class="icon-asterisk"></span>Registre-se
		</h3>
		<div>Registre-se com</div>
		<h:form>
			<div class="login-with text-center">
				<h:commandLink styleClass="logo-facebook"
					action="#{userSessionBean.register()}">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="facebook" />
					<f:setPropertyActionListener target="#{userSessionBean.isNewUser}"
						value="true" />
					<img src="images/facebook.png" />
				</h:commandLink>
				<h:commandLink styleClass="logo-twitter"
					action="#{userSessionBean.register()}">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="twitter" />
					<f:setPropertyActionListener target="#{userSessionBean.isNewUser}"
						value="true" />
					<img src="images/twitter.png" />
				</h:commandLink>
				<h:commandLink styleClass="logo-google"
					action="#{userSessionBean.register()}" rendered="false">
					<f:setPropertyActionListener target="#{userSessionBean.provider}"
						value="google" />
					<f:setPropertyActionListener target="#{userSessionBean.isNewUser}"
						value="true" />
					<img src="images/google.png" />
				</h:commandLink>
			</div>
			<div class="clear-both" style="padding-top: 30px;">Ou</div>
			<h:commandLink styleClass="login-with button"
				action="#{userSessionBean.register()}"
				value="Clique aqui para se registrar">
				<f:setPropertyActionListener target="#{userSessionBean.provider}"
					value="reviewit" />
				<f:setPropertyActionListener target="#{userSessionBean.isNewUser}"
					value="true" />
			</h:commandLink>
		</h:form>
	</div>
	<div id="dlg-upload-doc" class="reveal-modal medium">
		<a class="close-reveal-modal">&#215;</a>
		<h3>
			<span class="icon-cloud-upload"></span>Enviar documento
		</h3>
		<h:form id="form-upload-doc" enctype="multipart/form-data">
			<p:messages id="msg-upload-doc" autoUpdate="true" closable="true"
				showDetail="false" />

			<h:outputText for="upload-doc-title" value="Título" />
			<p:inputText id="upload-doc-title"
				value="#{documentBean.document.title}" required="true"
				requiredMessage="Favor informar o título" />

			<h:outputText for="upload-doc-type" value="Tipo" />
			<p:selectOneMenu id="upload-doc-type" value="#{documentBean.docType}">
				<f:selectItems value="#{documentBean.docTypes}"/>
			</p:selectOneMenu>

			<h:outputText for="upload-doc-licence" value="Licença" />
			<p:selectOneMenu id="upload-doc-licence" value="#{documentBean.docLicence}">
				<f:selectItems value="#{documentBean.docLicences}"/>
			</p:selectOneMenu>

			<h:outputText for="upload-doc-tags" value="Tags" />
			<p:autoComplete id="upload-doc-tags"
				value="#{documentBean.tags}" autocomplete="true"
				completeMethod="#{tagBean.autoComplete}" multiple="true" />

			<h:outputText for="upload-doc-description" value="Descrição" />
			<p:inputTextarea id="upload-doc-description"
				value="#{documentBean.document.description}" />
			
			<p:fileUpload id="upload-doc-file" value="#{documentBean.documentUploaded}" mode="simple" required="true"/>
			
			<p:commandButton actionListener="#{documentBean.save}"
				styleClass="button"
				oncomplete="validateForm(xhr, status, args, 'dlg-upload-doc')"
				value="Enviar Documento" update="form-upload-doc"
				process="form-upload-doc" ajax="false">
				<f:setPropertyActionListener target="#{documentBean.document.owner}"
					value="#{userSessionBean.user}"/>
			</p:commandButton>
			<p:button value="Cancelar" styleClass="button" />
		</h:form>
	</div>

	<!-- Feedback Form -->
	<!-- <div id="form-feedback" class="hide-form-feedback hide-for-small">
		<div class="title">Feedback</div>
		<h:form id="formfeedback">
		<p:messages id="msg-fedback" closable="true" showDetail="false" />
				
			<p:inputText id="feedback-nome"
				value="#{feedbackBean.nome}" required="true" validator="validaAlfaNumerico"
				requiredMessage="Favor informar o nome" />
			<p:watermark for="feedback-nome" value="Nome" />
			
			<p:inputText id="feedback-email"
				value="#{feedbackBean.email}" required="true" validator="validaEmail"
				requiredMessage="Favor informar o email" />
			<p:watermark for="feedback-email" value="Email" />
				
			<p:inputTextarea id="feedback-description" required="true" value="#{feedbackBean.mensagem}" />		
			<p:watermark for="feedback-description" value="Seu Comentário" />
			
			<p:commandButton action="#{feedbackBean.enviarFeedback()}"
				value="Enviar" update="formfeedback" process="formfeedback"/>
		</h:form>
	</div> -->

	<!-- Scripts -->
	<script type="text/javascript" src="js/jquery-ui.js"></script>
	<script type="text/javascript" src="js/foundation.js"></script>
	<script type="text/javascript" src="js/app.js"></script>
	<ui:insert name="js_body"></ui:insert>
</h:body>
</html>